p span {
    color: red;
}
.p3 {
    margin: auto;
    top: 10%;
    left: 10%;
    bottom: 0;
    right: 0;
    font-size: 40px;
    text-align: center;
    background-color: gold;
}
.p5 {
    margin: auto;
    top: 20%;
    left: 1%;
    bottom: 0;
    right: 0;
    font-size: 40px
}
.p5 span {
    display: block;
    margin: 0 30px 0 0;
    float: left;
}
html, body {
    height: 100%;
    margin: 0;
    background-color: aliceblue;
    overflow-y:auto;
}
.username {
    width: 100%;
    font-size: 50px;
    color: black;
    background-color: aliceblue;
    text-align: center
}
body {
    background-image: linear-gradient(135deg, rgb(255, 111, 216) 10%, rgb(56, 19, 194) 100%);
}
.container {
    padding: 10px;
}
.flex-al-jst-ct {
    display: flex;
    align-content: center;
    justify-content: center;
}
.display-flex {
    display: flex;
}
.flex-js-ct {
    justify-content: center;
}
.flex-al-it {
    align-items: center;
}
.flex-al-ct {
    align-content: center;
}
.flex-sp-ar {
    justify-content: space-around;
}
.flex-clom {
    flex-flow: column wrap;
}
.hed-title {
    padding: .9rem 0;
}
.title-shake {
    font-size: 1.08rem;
    color: #F4F4F4;
    font-weight: 700;
}
.activety-rule {
    padding: .9rem 0;
    color: gold;
    font-size: .8rem;
    font-weight: 700;
}
.last-time {
    color: greenyellow;
    font-size: .8rem;
    font-weight: 700;
}
.last-time p:nth-child(1) {
    text-align: center;
    display: inline-block;
}
.join-user {
    padding: .9rem 0;
    color: green;
    font-size: 1em;
}
.user-img img {
    width: 1rem;
    height: 1rem;
    /*vertical-align:middle;*/
}
div{
    border: 2px solid #77c571;
    margin: 3px;
    /*white-space:nowrap;*/
    border-radius:10px;
    background-color: #cc94c9;
    line-height:100%;
    display:table-cell;
    text-align:center;
}
.join-user-img {
    /*border: thin solid #FFF;*/
    /*border-radius: 5%;*/
    border: 2px solid #77c571;
    border-radius:10px;
    background-color: #cc94c9;
    width: 23%;
    /*text-align: center;*/
    margin-bottom: .2rem;
}
.join-user-img p{
    /*width: 100%;*/
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    /*color: #007aff;*/
    color: skyblue;
}